{% extends "bases/base-nav.html" %}
{% block title %}
{% endblock %}
{% block content %}

    <aside class="main-sidebar">

    <!-- sidebar: style can be found in sidebar.less -->
    <section class="sidebar">

    <!-- Sidebar user panel (optional) -->
    <div class="user-panel">
        <div class="pull-left image">
          <img src="/static/dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
        </div>
        <div class="pull-left info">
          <p>{{ request.session.UserName }}</p>
          <!-- Status -->
          <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
        </div>
    </div>

    <!-- search form (Optional) -->
    <form id="search-form" action="#" method="get" class="sidebar-form">
        {% csrf_token %}
        <div class="input-group">
          <input type="text" name="q" class="form-control" placeholder="Search...">
          <span class="input-group-btn">
              <button type="submit" name="search" id="search-btn" class="btn btn-flat"><i class="fa fa-search"></i>
              </button>
            </span>
        </div>
    </form>
    <!-- /.search form -->

    <!-- Sidebar Menu -->
    <ul id="tree-menu" class="sidebar-menu" data-widget="tree">
        <li class="header">菜单栏</li>
        <!-- Optionally, you can add icons to the links -->
        </li>
        {% load rbac %}
        {% rbac_menu request %}
    </ul>
    <!-- /.sidebar-menu -->
    </section>
    <!-- /.sidebar -->
    </aside>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
    <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                {% block page-title %}{% endblock %}
                <small>{% block page-title-sm %}{% endblock %}</small>
            </h1>
            <ol class="breadcrumb">

                {% block page-map-name %}
                    <!--<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
                    <li class="active"></li>-->
                {% endblock %}
            </ol>
        </section>
        <section class="content container-fluid">
            <!--------------------------
            | Your Page Content Here |
            -------------------------->
            {% block page-rcontent %}{% endblock %}
        </section>
    </div>

    <footer class="main-footer">
    <!-- To the right -->
    <div class="pull-right hidden-xs">
      Anything you want
    </div>
    <!-- Default to the left -->
        <strong>Copyright &copy; 2017 <a href="#">Company</a>.</strong> All rights reserved.
    </footer>

{% endblock %}

{% block scripter %}
{#    <script>#}
{#        $(function () {#}
{#            LoadLeftMenu()#}
{#        })#}
{##}
{#        //生成左侧菜单#}
{#        function LoadLeftMenu() {#}
{#            console.log($('#search-form input[name="csrfmiddlewaretoken"]').val());#}
{##}
{#            $.ajax({#}
{#                url: '/cmdb/get_menu',#}
{#                type: "GET",#}
{#                data: {"nid":''},#}
{#                headers: {"X-CSRFToken": $('#search-form input[name="csrfmiddlewaretoken"]').val()},#}
{#                success: function (arg) {#}
{#                    console.log(arg)#}
{#                    res = JSON.parse(arg)#}
{#                    if (res.status) {#}
{##}
{#                        var comment=loadTreeChildren(res.data);#}
{#                        $("#tree-menu").append(comment);#}
{##}
{##}
{#                    } else {#}
{#                        alert(res.msg);#}
{#                    }#}
{#                }#}
{#            })#}
{#        }#}
{##}
{#        function loadTreeChildren(commentList){#}
{#            var html = '';#}
{#            for (var i=0;i<  commentList.length;i++){#}
{#                var menu = commentList[i];#}
{#                if(menu.url == "") {#}
{#                    html += '<li class="treeview menu-open"><a><i class="fa fa-link"></i><span>' + menu.caption + '</span></span><span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span></a><ul class="treeview-menu" style="display: none;">'#}
{#                }else{#}
{#                    html += '<li><a href=' + menu.url + '><i class="fa fa-circle-o"></i><span>' + menu.caption + '</a></li>';#}
{#                }#}
{##}
{#                if(menu.children.length>0){#}
{#                   html += loadTreeChildren(menu.children);#}
{#                }#}
{##}
{#            }#}
{#            html+="</ul></li>";#}
{#            return html;#}
{#        }#}
{#    </script>#}
{% endblock %}

